{extend name="public/world"}
{block name="style"}
<style type="text/css">
    .layui-btn-xs {
        height: 18px;
        line-height: 18px;
        padding: 0 5px;
        font-size: 12px;
    }
</style>
{/block}
{block name="container"}
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <div class="layui-form layui-border-box layui-table-view">
                <div class="layui-table-tool">
                    <div class="layui-table-tool-temp">
                        <div class="layui-btn-group fl">
                            <button type="button" class="layui-btn layui-btn-xs open-all">全部展开</button>
                            <button type="button" class="layui-btn layui-btn-normal layui-btn-xs close-all">全部关闭</button>
                        </div>
                    </div>
                </div>
                <table class="layui-table" id="dataTable" lay-size="sm"></table>
            </div>
        </div>
    </div>
</div>
{/block}
{block name="script"}
<script>
    layui.use(['form','treeTable'], function() {
        var $ = layui.jquery
            , form = layui.form
            , treeTable = layui.treeTable;
        var	re = treeTable.render({
            elem: '#dataTable',
            data: {:json_encode($data)},
        icon_key: 'name',
            end: function(e){
            form.render();
        },
        cols: [
            {
                key: 'name',
                title: '名称',
                width: '350px',
                template: function(item){
                    if(item.level == 0){
                        return '<span style="color:red;">'+item.name+'</span>';
                    }else if(item.level == 1){
                        return '<span style="color:green;">'+item.name+'</span>';
                    } else {
                        return '<span>'+item.name+'</span>';
                    }
                }
            },
            {
                key: 'code',
                title: '编码',
                width: '100px',
            },
            {
                title: '操作',
                width: '120px',
                template: function(d){
                    var html = '';
                    {if isset($sonAuth['edit'])}
                        html += '<a href="{:url(\'/erp.Basics/editType\')}?id=' + d.id + '" class="layui-btn layui-btn-xs b-iframe-pop" title="修改">修改</a>';
                    {/if}
                    {if isset($sonAuth['add'])}
                        if (d.level < 2) html += '<a href="{:url(\'/erp.Basics/addType\')}?id=' + d.id + '" class="layui-btn layui-btn-xs layui-btn-normal b-iframe-pop" title="添加">添加</a>';
                    {/if}
                    return html;
                }
             }
            ]
        });
        // 全部展开
        $('.open-all').click(function(){
            treeTable.openAll(re);
        })
        // 全部关闭
        $('.close-all').click(function(){
            treeTable.closeAll(re);
        })
        $(document).on('click', '.b-iframe-pop', function() {
            var that = $(this);
            var url = that.attr('href'), title = that.attr('title');

            if (!url) {
                layer.msg('请设置href参数');
                return false;
            }

            layer.open({
                type: 2
                ,title: title
                ,content: url
                ,maxmin: true
                ,offset: '50px'
                ,area: ['700px','auto']
                ,btn: ['确定','取消']
                ,btnAlign: 'c' //按钮居中
                ,moveOut: true //true  可以拖出窗外  false 只能在窗内拖
                ,anim: 5 //出场动画 isOutAnim bool 关闭动画
                ,shade: .7 //遮罩
                ,resize: true //是否允许拉伸
                ,move: '.layui-layer-title' // 默认".layui-layer-title",// 触发拖动的元素
                ,success: function(layero){
                    layero.find('.layui-layer-min').remove();
                    layero.find('.layui-layer-close2').addClass('layui-layer-close1').removeClass('layui-layer-close2');
                }
                ,yes: function(index, layero){
                    var iframeWindow = window['layui-layer-iframe'+ index]
                        ,submitID = 'LAY-front-submit'
                        ,submit = layero.find('iframe').contents().find('#'+ submitID);
                    //监听提交
                    iframeWindow.layui.form.on('submit('+ submitID +')', function(data){
                        var field = data.field; //获取提交的字段
                        //提交 Ajax 成功后，静态更新表格中的数据
                        layer.load();
                        $.ajax({
                            type: 'POST',
                            url: url,
                            data: field,
                            dataType: "json",
                            success:function(res) {
                                if(res.msg) {
                                    layer.msg(res.msg);
                                }
                                if (res.code == 0) {
                                    layer.closeAll('loading');
                                }
                                if (res.code == 1) {
                                    re.data.push(res.data);
                                    treeTable.render(re);
                                    setTimeout(function() {
                                        layer.closeAll(); //关闭弹层
                                    }, 1500);
                                }
                                if (res.code == 2) {
                                    for(let id in res.data) {
                                        re.data.push(res.data[id]);
                                    }
                                    treeTable.render(re);
                                    setTimeout(function() {
                                        layer.closeAll(); //关闭弹层
                                    }, 1500);
                                }
                            }
                        });
                    });
                    submit.trigger('click');
                }
                ,cancel: function(){
                    layer.closeAll();
                    treeTable.render(re);
                    return false;
                }
            });
            return false;
        });
    });
</script>
{/block}